.home {
    min-height: 100vh;
    background-color: #f1f1f1;

    .home-header {
        background-color: #01acf5;
    }

    .btn-mag {
        height: 54px;
        display: flex;
        font-size: 30px;
        color: #ffffff;
        justify-content: center;
        align-items: center;

        >div {
            position: relative;
            width: 48%;
            height: 60%;
        }

        .icon-img {
            left: 0;
            top: 0;
            position: absolute;
            transition: all .5s ease-in-out;
        }

        &.active {
            color: #040404;
        }

        &:hover .icon-img {
            transform: rotate(180deg);
        }
    }
}

.book-box {

    padding: 10px;
    // display: flex;
    // flex-wrap: wrap;
    // justify-content: space-around;


    .book-frame {
        margin: 5px auto;
        position: relative;
        width: 98px;
        height: 137px;

        border-radius: 12px;
        overflow: hidden;

        >img {
            width: 100%;
            height: 100%;
        }

        .book-delbtn {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 20px;
            font-weight: 550;
            color: #ffffff;
            background-color: #272822a9;
        }

    }
}